<template>
  <el-row class="tc-head">
    <div class="tc-head-icon"></div>
    <div class="tc-head-title">{{ props.title }}</div>
  </el-row>
</template>

<script setup name="TcHead">
const props = defineProps({
  title: String
})
</script>

<style lang="scss">
@import "src/assets/styles/variables.module";

.tc-head {
  display: flex;
  align-items: center;
  padding: 0 6px 20px;

  &-icon {
    width: 6px;
    height: 16px;
    background-color: $--color-primary;
    border-radius: 3px;
  }

  &-title {
    font-size: 16px;
    color: #333333;
    margin-left: 6px;
  }
}

</style>
